<template>
    <div>
      <Row>
        <Card>
          系统配置
        </Card>
        <Card>
          <Form :model="detail" :label-width="150" ref="detail" :rules="ruleValidate">
            <Row>
              <FormItem label="推荐客户图片展示：" >
                <img v-if="detail.homePic" style="height:200px;width:300px" :src="detail.homePic" />
                <qiniu-upload v-bind:imgUrl.sync='detail.homePic'  :rate1="0.5" :rate2="2" buttonText="更改图片"/>
              </FormItem>
            </Row>
            <Row>
              <i-col span="12">
                <FormItem label="推荐注册佣金：" prop="registerReward">
                  <Input style="width: 250px;"  v-model="detail.registerReward"></Input>
                </FormItem>
              </i-col>
              <i-col span="12">
                <FormItem label="客服电话：" prop="customerService">
                  <Input style="width: 250px;"  v-model="detail.customerService"/>
                </FormItem>
              </i-col>
            </Row>
            <Row>
              <i-col span="12">
                <FormItem label="提现金额限制：" prop="cashLimit">
                  <InputNumber style="width: 100px;margin-right: 20px;"  v-model="detail.cashLimit"/>起
                </FormItem>
              </i-col>
              <i-col span="12">
                <FormItem label="提现手续费比率：" prop="withdrawReward">
                  <Input style="width: 250px;"  v-model="detail.withdrawReward"/>
                </FormItem>
              </i-col>
            </Row>
            <Row>
              <FormItem label="注册协议：" >
                <Editor :value.sync="detail.protocol"/>
              </FormItem>
            </Row>
            <FormItem>
              <Button type="primary" :loading="loading" @click="save('detail')">保存</Button>
            </FormItem>
          </Form>
        </Card>
      </Row>

    </div>
</template>


<script>
import { getConfig,editConfig } from '@/api/config'
import qiniuUpload from "_c/upload/qiniuUpload.vue"
import Editor from "_c/editor/editor.vue"

  export default {
    components: {
      qiniuUpload,
      Editor
    },
    name: 'user-list',
    data () {
      return {
        loading: false,
        detail: {},
        ruleValidate: {
          registerReward: [
            {required: true,  message: '普通vip价格不能为空', trigger: 'blur'}
          ],
          customerService: [
            {required: true, message: '超级vip价格不能为空', trigger: 'blur'}
          ],
          withdrawReward: [
            {required: true,  message: '提现费率不能为空', trigger: 'blur'}
          ],
          cashLimit: [
            {required: true, type:'number', message: '最少提现金额不能为空', trigger: 'blur'}
          ]
        }
      }
    },
    methods: {
      // 用户详情页
      getDetail () {
        getConfig().then(data => {
          this.detail = data
          this.detailOri = data
        })
      },
      save (name) {
        this.$refs[name].validate((valid) => {
          if (valid) {
            this.loading = true
            editConfig(this.detail).then(() => {
              this.loading = false
              this.$Message.success('修改成功');
            }, () => {
              this.loading = false
            })
          } else {
            this.$Message.error('信息有误');
            this.saveLoading = false
          }
        })
      },
      cancelBtn () {
        this.searchObj = {
          name: '',
          mobile: '',
          city: ''
        }
      }
    },
    mounted () {
      this.getDetail()
    }
  }
</script>

<style scoped>

</style>
